<template>
	<view>
		<view class="imgs">
			<image src="../../../static/iconvvv896.png" mode=""></image>
		</view>
		<view class="fs15" style="margin-top: 90rpx;text-align: center;">
			<span>再邀</span> <text>4</text><span>人 免费拿商品</span> 
		</view>
		<view  class="fs11"style="padding: 18rpx;text-align: center;margin-top: 22rpx;">
			<text style="color: rgba(200,200,200,1);">剩余时间</text>
			<text class="ss">58</text><span style="color: rgba(248,70,118,1);">:</span>
			<text class="ss">26</text>
		</view>
		<view class="w85" style="margin-top: 54rpx;">
			<view class="w20 fs12" v-for="item in 5">
				<image :src="item<=1?'../../../static/22.png':'../../../static/icon+2902.png'"></image>
				<text v-if="item<=1">我</text>
			</view>
		</view>
		<view class="w233 fs14" style="color: #FFFFFF;">立即邀请</view>
		<view class="fs12" style="text-align: center;color: rgba(151,151,151,1);"> 24小时不成团自动退款 </view>
		<view class="fs12 bom" style="text-align: center;color: rgba(151,151,151,1);">
			<navigator url="../pintuanGZ/pintuanGZ">拼团规则</navigator>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	.title{
		position: relative;
	}
	.returnh{
		 width: 20px;
		 height: 20px;
		 position: absolute;
		 left: 34rpx;
		 top: 25rpx;
	}
	.title>text{
		display: block;
		color: rgba(51,51,51,1);
		text-align: center;
		line-height: 88rpx;
	}
	.imgs{
		width: 100%;
		height: 116rpx;
		margin-top: 60rpx;
		position: relative;
	}
	.imgs>image{
		width: 198rpx;
		height: 110rpx;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
	}
	.ss{
		width: 40rpx;
		height: 40rpx;
		color: #FFFFFF;
		display: inline-block;
		border-radius: 8rpx;
		text-align: center;
		line-height: 40rpx;
		background:  rgba(248,70,118,1);
	}
	.w85{
		width: 85%;
		margin: 0 auto;
		display: flex;
	}
	.w20{
		width: 20%;
		height: 160rpx;
	}
	.w20>image{
		display: block;
		width: 88rpx;
		height: 88rpx;
		border-radius: 50%;
		margin: 0 auto;
	}
	.w20>text{
		display: block;
		text-align: center;
		margin-top: 26rpx;
	}
	.w233{
		width: 466rpx;
		height: 76rpx;
		background: rgba(36,188,129,1);
		text-align: center;
		line-height: 76rpx;
		margin:50rpx auto;
	}
	.bom{
		position: absolute;
		bottom: 5%;
		left: 50%;
		transform: translateX(-50%);
	}
</style>